<template>
	<!-- 采购订单 -->
	<view class="wrap1">

		<u-tabs-swiper ref="uTabs" :list="tablist" :current="swiperCurrent" @change="tabsChange" :is-scroll="true"
			:font-size="30" active-color="#feee0b" inactive-color="#fff" bg-color="#2e3a76" swiperWidth="750"></u-tabs-swiper>

		<view class="wrap">
			<u-section class="mt20 mb12" :title="tablist[swiperCurrent].name" :right="false" :show-line="true"></u-section>
			<view v-if="orderList.length > 0">
				<view class="mt4" v-for="(item, index) in filteredOrderList" :key="index">
					
					<u-card :title="'编号：' + item.code" :sub-title="item.createtime" :thumb="item.image" margin='0rpx'
						@click=onClick(item.id)>
						<view class="" slot="body">
							<view class="title-wrap">
								<text class="title u-line-2"><text class="font-weight-bold">客户名称：</text>{{
									item.customer_name }}</text>
								<text class="title u-line-2"><text class="font-weight-bold">联 系 人 ：</text>{{ item.linkman
								}}</text>
								<text class="title u-line-2"><text class="font-weight-bold">联系电话：</text>{{ item.phone
								}}</text>
								<text class="title u-line-2"><text class="font-weight-bold">交货方式：</text>{{
									typelist[item.type] == '' ? '' : typelist[item.type - 1].label }}</text>
								<text class="title u-line-2"><text class="font-weight-bold">产品总价：</text>￥{{ item.real_money
								}}</text>
								<text class="title u-line-2"><text class="font-weight-bold">制单时间：</text>{{ item.createtime
								}}</text>
							</view>
						</view>
						<view class="" slot="head">
							<u-row gutter="16" justify="flex-end">
								<u-col span="8">
									<text class="title u-line-2">编号：{{ item.code }}</text>
								</u-col>
								<u-col span="4">
									<!-- <u-tag :text="statusList[item.status].text" mode="light"
										:type="statusList[item.status].type" shape="circle" /> -->
									<u-tag :text="getStatusText(item.status)" mode="light" :type="getStatusType(item.status)"
										shape="circle" />

								</u-col>
							</u-row>
						</view>
					</u-card>
				</view>
			</view>
		</view>

		<u-toast ref="uToast" />
	</view>
</template>

<script>
var _this;
export default {
	data() {
		return {
			tablist: [
				{
					name: '全部',
					index: 100
					
				},
				{
					name: '待提交',
					index: -2

				}, {
					name: '待生产确认',
					index: 2


				}, {
					name: '待财务审核',
					index: 0


				}, {
					name: '财务审核失败',
					index: 1

				}, {
					name: '待选配',
					index: 3

				}, {
					name: '待生产完成',
					index: 4

				}, {
					name: '待付尾款',
					index: 5

				}, {
					name: '尾款待审核',
					index: 6

				}, 
				// {
				// 	name: '尾款审核通过 ',
				// 	index: 7


				// }, 
				{
					name: '尾款审核失败',
					index: 8


				}, {
					name: '待发货',
					index: 9


				}, {
					name: '已发货',
					index: 10


				}, {
					name: '已收货',
					index: 11


				}, {
					name: '发起退货',
					index: 12


				}, {
					name: '退货成功',
					index: 13


				}, {
					name: '订单完成',
					index: 14


				}, {
					name: '作废',
					index: -1

				}
			],

			swiperCurrent: 0,
			currentTabName: 100, // 当前选项卡名称
			orderList: [],
			statusList: [
				{
					text: '待提交',
					type: 'info',
					index: -2

				}, {
					text: '待生产确认',
					type: 'error',
					index: 2

				}, {
					text: '待财务审核',
					type: 'info',
					index: 0

				}, {
					text: '财务审核失败',
					type: 'error',
					index: 1

				}, {
					text: '待选配',
					type: 'info',
					index: 3
				}, {
					text: '待生产完成',
					type: 'info',
					index: 4
				}, {
					text: '待付尾款',
					type: 'info',
					index: 5
				}, {
					text: '尾款待审核',
					type: 'info',
					index: 6
				}, {
					text: '尾款审核通过 ',
					type: 'success',
					index: 7
				}, {
					text: '尾款审核失败',
					type: 'error',
					index: 8
				}, {
					text: '待发货',
					type: 'info',
					index: 9
				}, {
					text: '已发货',
					type: 'success',
					index: 10
				}, {
					text: '已收货',
					type: 'success',
					index: 11
				}, {
					text: '发起退货',
					type: 'info',
					index: 12
				}, {
					text: '退货成功',
					type: 'success',
					index: 13
				}, {
					text: '订单完成',
					type: 'success',
					index: 14
				}, {
					text: '作废',
					type: 'error',
					index: -1
				}
			],
			typelist: [{
				label: '买家自提',
			}, {
				label: '卖家发货',
			}, {
				label: '代发',
			}],
		}

	},
	onShow() {
		_this.getOrderList();

	},
	onLoad() {
		_this = this;
		_this.getOrderList();

	},
	computed: {
		// 根据当前选项卡名称过滤订单列表
        filteredOrderList() {
            if (this.currentTabName === 100) {
                return this.orderList;
            } else {
                return this.orderList.filter(item => item.status === this.currentTabName);
            }
        },
		getStatusText() {
			return function (status) {
				const statusItem = this.statusList.find(item => item.index === status);
				return statusItem ? statusItem.text : '未知状态';
			}
		},
		getStatusType() {
			return function (status) {
				const statusItem = this.statusList.find(item => item.index === status);
				return statusItem ? statusItem.type : 'default';
			}
		}
	},
	methods: {
		getOrderList() {
			_this._post_form('/api/ykjp/sell/sell/index', {}, (result) => {
				for (let i = 0; i < result.data.data.length; i++) {
					result.data.data[i].createtime = _this.transformTime(result.data.data[i].createtime);
				}
				_this.setData({ 'orderList': result.data.data })
			});
		},
		// tabs通知swiper切换
		tabsChange(index) {
			this.swiperCurrent = index;
			this.currentTabName = this.tablist[index].index; // 更新当前选项卡名称
			// this.swiperCurrent = index;
		},
		onClick(id) {
			uni.navigateTo({
				url: 'orderdetail?id=' + id
			})
		}
	}
}
</script>


<style scoped lang="scss">
.wrap1 {
	display: flex;
	flex-direction: column;
	height: calc(100vh - var(--window-top));
	width: 100%;
}
</style>
